import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Result, List, WhiteSpace, Modal} from 'antd-mobile'
import browserCookie from 'browser-cookies'
import { logoutSubmit } from '../../redux/user.redux'
import { Redirect } from 'react-router-dom'
@connect(
  state=>state.user,
  {logoutSubmit}
)
class User extends Component {
  constructor(props){
    super(props)
    this.logout = this.logout.bind(this)
  }

  logout(){
    const alert = Modal.alert
    alert('注销','确认退出吗?',[
      {text:'取消',onPress:()=>console.log('取消')},
      {text:'确定',onPress:()=>{
        
        browserCookie.erase('userid')
        this.props.logoutSubmit()
      }},
    ])
  }
  render(){
    const {avatar} = this.props 
    const Item = List.Item
    const Brief = Item.Brief
    return avatar?(
      <div>
        <Result
          img={<img src={require(`../img/${avatar}.png`)} style={{width:50}} alt='#'></img>}
          title={this.props.user}
          message={this.props.type=='boss'?this.props.company:null}
        />
        <List renderHeader={()=>'简介'}>
          <Item
            multipleLine
          >
            {this.props.title}
            {this.props.desc.split('\n').map(d=>(
              <Brief key='d'>{d}</Brief>
            ))}
            {this.props.money?<Brief >薪资:{this.props.money}</Brief>:null}
            
          </Item>
        </List>
        <WhiteSpace/>
        <List>
          <Item onClick={this.logout}>退出登录</Item>
        </List>
      </div>

    ):<Redirect to={this.props.redirectTo} />

  }
}

export default User